<!DOCTYPE html>
<html lang="en">
    {% load static %}
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="{% static 'css/jquery.mCustomScrollbar.min.css' %}">
    <link rel="stylesheet" href="{% static 'css/index.css' %}">
    <script src='{% static "js/jQuery-1.12.4.js" %}'></script>
    <script src='{% static "js/jquery.mCustomScrollbar.concat.min.js" %}'></script>
    <script src="{% static 'js/player.js' %}"></script>
    <script src="{% static 'js/process.js'%}"></script>
    <script src="{% static 'js/Lyrics.js' %}"></script>
    <link rel="stylesheet" href="../static/layui/css/layui.css">
    <script src="../static/layui/layui.js"></script>

</head>

<body>
    <div class="header">
        <a href={% url 'index' %} class="logo"></a>
        <ul>
        {% if current_etyn == None %}
            <a href={% url 'logn' %}><span>登录</span></a>
          {% else %}
          <div>
            <ul class="layui-nav" lay-bar="disabled">
              <li class="layui-nav-item" lay-unselect="">
                <img src="/media/{{current_etyn.mtkg_img}}" class="layui-nav-img"></a>
                <dl class="layui-nav-child">
                  <dd style="text-align: center;"><a href={% url 'tcdl' %}>退出登录</a></dd>
                </dl>
              </li>
            </ul>
          </div>
          {% endif %}
        </ul>
    </div>
    <div class="center">
        <div class="center_in">
            <div class="center_left">
                <!-- <div class="center_bar">
                    <span><i></i>收藏</span>
                    <span><i></i>添加到</span>
                    <span><i></i>下载</span>
                    <span><i></i>删除</span>
                    <span><i></i>清空列表</span>
                </div> -->
                <ul class="center_list" data-mcs-theme="minimal-dark">
                    <li class="content_title">
                        <div class="content_check"><span></span></div>
                        <div class="content_number"></div>
                        <div class="content_music">歌曲</div>
                        <div class="content_singer">歌手</div>
                        <div class="content_time">时长</div>
                    </li>
                </ul>
            </div>
            <div class="center_right">
                <div class="song_info">
                    <a href="javascript:;" class="bj"><img src="{% static 'img/singer.jpg' %}" alt=""></a>
                    <div class="song_info_name">
                        歌曲:
                        <a href="javascript:;">栀子花开</a>
                    </div>
                    <div class="song_info_singer">
                        歌手:
                        <a href="javascript:;">何炅</a>
                    </div>
                    <div class="song_info_album">
                        专辑:
                        <a href="javascript:;">莲</a>
                    </div>
                </div>
                <div class="song_word_container">
                    <ul class="song_word">
                        <!-- <li class="current">歌词1</li> -->

                    </ul>
                </div>

            </div>
        </div>
    </div>
    <div class="bottom">
        <div class="bottom_in">
            <a href="javascript:;" class="music_pre"></a>
            <a href="javascript:;" class="music_play"></a>
            <a href="javascript:;" class="music_next"></a>
            <div class="play_info">
                <div class="play_info_top">
                    <span class="left">栀子花开-何炅/吱吱</span>
                    <span class="right">00:40/05:20</span>
                </div>
                <div class="play_info_bar">
                    <div class="play_info_current">
                        <div class="ball"></div>
                    </div>
                </div>
            </div>
            <!-- <a href="javascript:;" class="music_while"></a> -->
            <a href="javascript:;" class="music_faver"></a>
            <a href="javascript:;" class="music_down"></a>
            <!-- <a href="javascript:;" class="music_comment"></a> -->
            <a href="javascript:;" class="music_pure "></a>
            <div class="music_volume">
                <a href="javascript:;" class="voice"></a>
                <div class="play_volume">
                    <div class="play_volume_bar">
                        <div class="play_volume_current">
                            <div class="volume_ball"></div>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
    <div class="mask">
    </div>
    <div class="mask_bj"></div>
    <audio src=""></audio>
    <div class="pureMask">
        <div class="pure_container">

        </div>
    </div>
</body>

</html>
<script>
    var odkl = {{odkl}}
    var id = {{id}}
</script>
<script src='{% static "js/index.js" %}'></script>
<style>
    .layui-nav{
        background-color:#ffffff00;
    }
</style>